<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
                template="./templates/templateLogin.xhtml"
                xmlns="http://www.w3.org/1999/xhtml"
                xmlns:p="http://primefaces.org/ui"
                xmlns:h="http://xmlns.jcp.org/jsf/html"
                xmlns:f="http://xmlns.jcp.org/jsf/core">

    <ui:define name="title">
        Login
    </ui:define>

    <ui:define name="content">

        <p:growl id="growlLogin" life="5000" showDetail="true"/>

        <p:accordionPanel id="accordionPanelLogin">

            <p:tab title="Realizar login">
                <h:form id="formLogin">
                    <h:outputLink id="loginLink" title="login" value="javascript:void(0)"
                                  onclick="dialogLogin.show()">
                        <p:graphicImage value="/resources/images/login.png"/>  
                    </h:outputLink>
                    <p:dialog id="dialogLogin" header="Inserir Usuário e Senha" widgetVar="dialogLogin" resizable="false"
                              modal="true" showEffect="pulsate" hideEffect="clip" draggable="false">

                        <h:panelGrid columns="2" cellpadding="5">  

                            <h:outputLabel for="nomeUsuario" value="Usuário:"/>  
                            <p:inputText id="nomeUsuario" title="Nome de Usuário" label="Nome de usuário" required="true"
                                         requiredMessage="Favor informar o nome de usuário."
                                         value="#{loginBean.usuario.nomeUsuario}">
                                <p:watermark for="nomeUsuario" value="Nome de usuário"/>
                                <p:message for="nomeUsuario"/>
                                <f:validateLength minimum="4" maximum="10"/>
                            </p:inputText>

                            <h:outputLabel for="senhaLogin" value="Senha:"/>  
                            <p:password id="senhaLogin" title="Senha" label="Senha" required="true"
                                        requiredMessage="Favor informar a senha."
                                        value="#{loginBean.usuario.senha}">
                                <p:watermark for="senhaLogin" value="Senha"/>
                                <p:message for="senhaLogin"/>
                                <f:validateLength minimum="4" maximum="10"/>
                            </p:password>

                            <f:facet name="footer">
                                <center>
                                    <p:commandButton id="loginButton" title="Realizar login" label="Realizar login" value="Entrar"
                                                     icon="icon-login" oncomplete="handleLoginRequest(xhr, status, args)"
                                                     update=":growlLogin"                                             
                                                     actionListener="#{loginBean.login(actionEvent)}"/>
                                </center>
                            </f:facet>  

                        </h:panelGrid>

                    </p:dialog>

                </h:form>
            </p:tab>

            <p:tab title="Realizar auto-registro">
                <h:form>
                    <p:commandLink id="cmdLinkRegistrarUsuario" title="Realizar auto-registro" value="Registrar-se"
                                   oncomplete="dialogRegistrarUsuario.show()"/>
                </h:form>
            </p:tab>

        </p:accordionPanel>

        <h:form id="formRegistrarUsuario">

            <p:dialog id="dialogRegistrarUsuario" header="Registrar Usuário" widgetVar="dialogRegistrarUsuario" resizable="false"
                      showEffect="size" hideEffect="blind" modal="true" draggable="true">

                <h:inputHidden id="codVisitante" value="#{usuarioBean.usuarioSelecionado.funcao.codFuncao}" />
                <h:inputHidden id="estadoVisitante" value="#{usuarioBean.usuarioSelecionado.estado}" />

                <h:panelGrid id="panelGridRegistrarUsuario" columns="2" cellpadding="4" style="margin:0 auto;">

                    <h:outputLabel for="nomeUsuarioRegistrarUsuario" value="* Nome Usuário:"/>
                    <p:inputText id="nomeUsuarioRegistrarUsuario" title="Nome de usuário" label="Nome de usuário" required="true"
                                 requiredMessage="Por favor informe o nome de usuário."
                                 validatorMessage="Nº mínimo de caracteres do campo 'Nome usuário': 4"
                                 value="#{usuarioBean.usuarioSelecionado.nomeUsuario}">
                        <p:watermark for="nomeUsuarioRegistrarUsuario" value="Nome de usuário"/>
                        <p:message for="nomeUsuarioRegistrarUsuario"/>
                        <f:validateLength minimum="4" maximum="10"/>
                    </p:inputText>

                    <h:outputLabel for="funcaoRegistrarUsuario" value="* Função:"/>
                    <p:outputLabel id="funcaoRegistrarUsuario" value="Visitante" title="Esse é o tipo de usuário que irá visualizar reservas"/>

                    <h:outputLabel for="senhaRegistrarUsuario" value="* Senha:"/>
                    <p:password id="senhaRegistrarUsuario" title="Senha do usuário" label="Senha" required="true"
                                requiredMessage="Por favor insira a senha."
                                match ="senhaConfirmarRegistrarUsuario" validatorMessage="As senhas não correspondem."
                                value="#{usuarioBean.usuarioSelecionado.senha}">
                        <p:message for="senhaRegistrarUsuario"/>
                        <f:validateLength minimum="4" maximum="10"/>
                    </p:password>

                    <h:outputLabel for="senhaConfirmarRegistrarUsuario" value="* Confirmar Senha:"/>
                    <p:password id="senhaConfirmarRegistrarUsuario" title="Confirme a senha" label="Confirmar senha" required="true"
                                requiredMessage="Por favor confirme a senha."
                                validatorMessage="Nº mínimo de caracteres do campo 'Senha': 4"
                                value="#{usuarioBean.usuarioSelecionado.senha}">
                        <p:message for="senhaConfirmarRegistrarUsuario"/>
                        <f:validateLength minimum="4" maximum="10"/>
                    </p:password>

                    <h:outputLabel for="nomeRegistrarUsuario" value="* Nome:"/>
                    <p:inputText id="nomeRegistrarUsuario" title="Nome completo do usuário" label="Nome da pessoa" required="true"
                                 requiredMessage="Por favor insira o nome e sobrenome."
                                 value="#{usuarioBean.usuarioSelecionado.nome}">
                        <p:watermark for="nomeRegistrarUsuario" value="Nome e sobrenome"/>
                        <p:message for="nomeRegistrarUsuario"/>
                    </p:inputText>

                    <h:outputLabel for="cpfRegistrarUsuario" value="* CPF:"/>  
                    <p:inputMask id="cpfRegistrarUsuario" title="CPF do usuário" label="CPF do usuário" mask="999.999.999-99"
                                 required="true" requiredMessage="Por favor insira o CPF."
                                 value="#{usuarioBean.usuarioSelecionado.cpf}">
                        <p:watermark for="cpfRegistrarUsuario" value="Somente números"/>
                        <f:validator validatorId="cpf"/>
                        <p:message for="cpfRegistrarUsuario"/>
                    </p:inputMask>

                    <h:outputLabel for="emailRegistrarUsuario" value="* E-mail:"/>
                    <p:inputText id="emailRegistrarUsuario" title="E-mail" label="E-mail do usuário"
                                 validatorMessage="Formato de e-mail inválido."
                                 requiredMessage="Por favor insira o endereço de e-mail."
                                 value="#{usuarioBean.usuarioSelecionado.email}" required="true">
                        <f:validateRegex
                            pattern="^[_A-Za-z0-9-\+]+(\.[_A-Za-z0-9-]+)*@[A-Za-z0-9-]+(\.[A-Za-z0-9]+)*(\.[A-Za-z]{2,})$"/>
                        <p:watermark for="emailRegistrarUsuario" value="ex: user@mail.com" />
                        <p:message for="emailRegistrarUsuario"/>
                    </p:inputText>

                    <f:facet name="footer">
                        <p:separator/>
                        <center>
                            <p:commandButton id="btnAceitarRegistrarUsuario" title="Registrar o usuário" label="Salvar" value="Registrar"
                                             icon="icon-salvar" oncomplete="dialogRegistrarUsuario.hide()"
                                             update=":growlLogin"
                                             validateClient="true"
                                             onclick="setCodFuncaoVisitante(3);
                                                     setEstadoVisitante('A');"
                                             actionListener="#{usuarioBean.btnCriarUsuario(actionEvent)}"/>
                            <p:commandButton id="btnCancelarRegistrarUsuario" title="Cancelar" label="Cancelar" value="Cancelar"
                                             icon="icon-cancelar" oncomplete="dialogRegistrarUsuario.hide()"/>

                        </center>
                    </f:facet>

                </h:panelGrid>

            </p:dialog>

        </h:form>

    </ui:define>

</ui:composition>